<template>
  <view class="content">
    <u-line-progress :percentage="30" activeColor="#ff0000"></u-line-progress>
    <image class="logo" src="/static/logo.png"></image>
    <view>
      <text class="title">{{ pageIndex == 1 ? 'C端' : 'B端' }}</text>
    </view>

    <button @click="scanCode">扫码</button>

    <div id="reader"></div>
    <!-- 事例 -->
    <!-- NumberBox 步进器 -->
    <u-number-box v-model="value" @change="valChange"></u-number-box>

    <!-- 倒计时 毫秒级渲染 -->
    <!-- <u-count-down :time="30 * 60 * 60 * 1000" format="HH:mm:ss:SSS" autoStart millisecond></u-count-down> -->

    <button type="default" @click="clickChange">切换</button>
    <!-- <u-swiper :list="listArr" indicator indicatorMode="line" circular></u-swiper> -->
    <movable-area style="width: 750rpx; height: 400rpx; background-color: red">
      <movable-view style="width: 80rpx; height: 80rpx; background-color: #999" :x="x" :y="y" direction="all" @change="onChange"> </movable-view>
      <movable-view style="width: 60rpx; height: 60rpx; margin-top: 90rpx" :x="x" :y="y" direction="all" @change="onChange">
        <view class="box2"></view>
      </movable-view>
    </movable-area>

    <my-bar :selected="0"></my-bar>
  </view>
</template>

<script>
export default {
  data() {
    return {
      title: 'Hello',
      value: 0,
      pageIndex: 1,
      listArr: ['https://cdn.uviewui.com/uview/swiper/swiper1.png', 'https://cdn.uviewui.com/uview/swiper/swiper2.png', 'https://cdn.uviewui.com/uview/swiper/swiper3.png'],
      html5QrCode: null,
      x: 0,
      y: 0,
      old: {
        x: 0,
        y: 0,
      },
    }
  },
  onLoad() {
    if (uni.getStorageSync('pageIndex')) {
      this.pageIndex = uni.getStorageSync('pageIndex')
      if (this.pageIndex === 2) {
        // this.list = this.$tarBarList.B
        uni.setStorageSync('pageIndex', 2)
      } else {
        // C端
        this.pageIndex = 1
        uni.setStorageSync('pageIndex', 1)
        // 获取热推商品数组
      }
    } else {
      // C端
      this.pageIndex = 1
      uni.setStorageSync('pageIndex', 1)
      // 获取热推商品数组
    }
  },

  methods: {
    onChange: function (e) {
      this.old.x = e.detail.x
      this.old.y = e.detail.y
    },
    valChange(e) {
      console.log('当前值为: ' + e.value)
    },

    clickChange() {
      if (this.pageIndex === 1) {
        uni.setStorageSync('pageIndex', 2)
      } else {
        uni.setStorageSync('pageIndex', 1)
      }
      //中转切换页
      uni.navigateTo({
        url: '/pages/index/changePage',
      })
    },

    scanCode() {
      uni.navigateTo({
        url: '/pages/index/h5ScanCode',
      })
    },
    // 获取相机设备
  },
}
</script>

<style>
.content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.logo {
  height: 200rpx;
  width: 200rpx;
  margin: 200rpx auto 50rpx auto;
}

.text-area {
  display: flex;
  justify-content: center;
}

.title {
  font-size: 36rpx;
  color: red;
}

.movable-area {
  width: 100%;
  height: 499rpx;
  background-color: #999;
}

.box2 {
  width: 60rpx;
  height: 60rpx;
  background-color: #000099;
}
</style>
